<template>
  <div class="sys-select">
    <el-select v-model="currValue" clearable v-bind="$attrs" v-on="$listeners">
      <el-option v-for="item in options" :key="item.value" :value="item.value" :label="item.label"></el-option>
    </el-select>
  </div>
</template>

<script>
export default {
  name: 'sys-select',
  cnName: '字典选择器',
  props: {
    value: [String, Number],
    type: String,
    data: Array
  },
  data() {
    return {
      currValue: this.value
    }
  },
  computed: {
    options() {
      const constant = this.$store.state.constant
      if(this.data) {
        return this.data
      }
      const list = constant[this.type]
      if(!list) {
        throw new Error('找不到' + this.type + '对应的字典')
      }
      return list
    }
  },
  watch: {
    value(val) {
      this.currValue = val
    },
    currValue() {
      this.$emit('input', this.currValue)
    }
  },
  methods: {}
}
</script>

<style lang="scss" scoped>
.sys-select {
  display: inline-block;
}
</style>
